﻿<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Aquarium Administration</title>
    <link rel="stylesheet" href="~/Content/layui/css/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="http://cdn.bootcss.com/font-awesome/4.6.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="~/Content/build/css/app.css" media="all">
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script><!--国内的JQuery源，会比谷歌的快很多-->
    <script src="~/Content/layui/layui.js"></script>
</head>

<body>
    <div class="layui-layout layui-layout-admin kit-layout-admin">
        <div class="layui-header">
            <div class="layui-logo">Aquarium SuiSui</div>
            <div class="layui-logo kit-logo-mobile">AQ</div>
            <ul class="layui-nav layui-layout-right kit-nav">
                <li class="layui-nav-item">
                    rika
                </li>
                <li class="layui-nav-item"><a href="/Admin/Logout"><i class="fa fa-sign-out" aria-hidden="true"></i> 離開</a></li>
            </ul>
        </div>

        <div class="layui-side layui-bg-black kit-side">
            <div class="layui-side-scroll">
                <div title="菜单缩放" class="kit-side-fold"><i class="fa fa-navicon" aria-hidden="true"></i></div>
                <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
                <ul class="layui-nav layui-nav-tree" lay-filter="kitNavbar" kit-navbar>
                    <li class="News layui-nav-item">
                        <a href="/News"><i class="layui-icon layui-icon-file" aria-hidden="true"></i><span> News</span></a>
                    </li>
                    <li class="Profile layui-nav-item">
                        <a href="/Profile"><i class="layui-icon layui-icon-list" aria-hidden="true"></i><span> Profile</span></a>
                    </li>
                    <li class="Post layui-nav-item">
                        <a href="/Post"><i class="layui-icon layui-icon-edit" aria-hidden="true"></i><span> Post</span></a>
                    </li>
                    <li class="Contact layui-nav-item">
                        <a href="/Contact"><i class="layui-icon layui-icon-cellphone" aria-hidden="true"></i><span> Contact</span></a>
                    </li>
                    <li class="Article layui-nav-item">
                        <a href="/Article"><i class="layui-icon layui-icon-read" aria-hidden="true"></i><span> Article</span></a>
                    </li>
                    <li class="Files layui-nav-item">
                        <a href="/Admin/FileUpload"><i class="layui-icon layui-icon-upload" aria-hidden="true"></i><span> Files</span></a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="layui-body" id="container">
            <!-- 内容主体区域 -->
            <div style="padding: 15px;">
                <link rel="stylesheet" href="~/Content/build/css/doc.css" media="all" />
                <div class="layui-tab layui-tab-card" lay-filter="kitTab">
                    <ul class="layui-tab-title">
                        <li class="" lay-id="0">@Html.ActionLink("新規データ", "Create")</li>
                        <li class="" lay-id="1"><a href="/Admin/Management">管理画面へ戻る</a></li>
                    </ul>

                    <div class="layui-tab-content">
                        <div class="kit-doc" style="overflow: auto;">
                            <blockquote class="layui-elem-quote">ここでデータのCRUD管理などできます。</blockquote>

                            @RenderBody()
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="layui-footer">
            <!-- 底部固定区域 -->
            2017 &copy;
            <a href="http://www.51qianduan.com//">kit.zhengjinfan.cn/</a> MIT license

        </div>
    </div>

    <script>
        //高亮显示选定项目
        var host = window.location.host; //主机名
        var url = window.location.href; //域名
        var arr = ["News", "Profile", "Post", "Contact", "Article"];
        var loc = url.split(host + "/")[1];
        if (arr.indexOf(loc) >= 0 && arr.indexOf(loc) <= 4) {
            document.getElementsByClassName(loc)[0].className += " layui-nav-itemed";
        }
        //Files页面的显示出现错误，暂未解决

        layui.use('element', function () {
            var element = layui.element;
        });
        layui.use('form', function () {
            var form = layui.form;
            form.render();
        })
        var isShow = true;  //定义一个标志位
        $('.kit-side-fold').click(function () {
            //选择出所有的span，并判断是不是hidden
            $('.layui-nav-item span').each(function () {
                if ($(this).is(':hidden')) {
                    $(this).show();
                } else {
                    $(this).hide();
                }
            });
            //判断isshow的状态
            if (isShow) {
                $('.layui-side.layui-bg-black').width(60); //设置宽度
                $('.kit-side-fold i').css('margin-right', '%');  //修改图标的位置
                //将footer和body的宽度修改
                $('.layui-body').css('left', 60 + 'px');
                $('.layui-footer').css('left', 60 + 'px');
                //将二级导航栏隐藏
                $('dd span').each(function () {
                    $(this).hide();
                });
                //修改标志位
                isShow = false;
            } else {
                $('.layui-side.layui-bg-black').width(200);
                $('.kit-side-fold i').css('margin-right', '10%');
                $('.layui-body').css('left', 200 + 'px');
                $('.layui-footer').css('left', 200 + 'px');
                $('dd span').each(function () {
                    $(this).show();
                });
                isShow = true;
            }
        });
    </script>
</body>

</html>